import { StyleSheet } from 'react-native';
import {
  APP_ORANGE_BUTTON,
  APP_BLACK,
  APP_YELLOW
} from '../../../../../../constant/color';
import { phonePx } from '../../../../../../util/adapt';
import statusBarManager from '../../../../../../util/native/statusBarManager';
import { getScreenInfo } from '../../../../../../util/screen';

const { width } = getScreenInfo({});

export default StyleSheet.create({
  container: {
    position: 'absolute',
    top: 0,
    width,
    backgroundColor: APP_YELLOW,
    borderBottomLeftRadius: phonePx(14),
    borderBottomRightRadius: phonePx(14)
  },
  loadInfo: {
    flexDirection: 'row',
    marginTop: phonePx(16) + statusBarManager.getStatusBarHeight(),
    alignItems: 'flex-end'
  },
  loadGrade: {
    flexDirection: 'row',
    justifyContent: 'space-between',
    alignItems: 'center',
    width: phonePx(90),
    height: phonePx(28),
    borderRadius: phonePx(14),
    backgroundColor: APP_YELLOW,
    marginLeft: phonePx(16)
  },
  grade: {
    fontSize: phonePx(16),
    color: APP_BLACK,
    fontWeight: '500',
    marginLeft: phonePx(14)
  },
  pullUpArrow: {
    width: phonePx(8),
    height: phonePx(6),
    marginRight: phonePx(14)
  },
  selectDesc: {
    fontSize: phonePx(12),
    color: APP_BLACK,
    fontWeight: '400',
    marginLeft: phonePx(6),
    marginBottom: phonePx(6)
  },
  content: {
    marginTop: phonePx(1),
    marginBottom: phonePx(20)
  },
  loadGrades: {
    flexDirection: 'row',
    flexWrap: 'wrap',
    paddingHorizontal: phonePx(23)
  },
  selectGrade: {
    width: phonePx(60),
    height: phonePx(30),
    backgroundColor: '#fff',
    borderRadius: phonePx(15),
    marginHorizontal: phonePx(7),
    marginTop: phonePx(14),
    alignItems: 'center',
    justifyContent: 'center'
  },
  gradeDesc: {
    fontSize: phonePx(12),
    color: APP_BLACK,
    fontWeight: '500'
  },
  loadLine: {
    flex: 1,
    justifyContent: 'flex-end',
    alignItems: 'center'
  },
  line: {
    width: phonePx(34),
    height: phonePx(3),
    borderRadius: phonePx(1.5),
    backgroundColor: APP_ORANGE_BUTTON,
    marginBottom: phonePx(9)
  }
});
